<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>Web Application | todo</title>
		<meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>css/bootstrap.css" type="text/css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>css/animate.css" type="text/css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>css/font-awesome.min.css" type="text/css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>css/font.css" type="text/css" cache="false" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>js/datatables/datatables_ori.css" type="text/css" />
		<link rel="stylesheet" href="<?php echo base_url(); ?>css/app.css" type="text/css" />
	</head>
	<body>
		<section class="panel">
			<header class="panel-heading">
				DataTables 
				<i class="fa fa-info-sign text-muted" data-toggle="tooltip" data-placement="bottom" data-title="ajax to load the data."></i> 
			</header>
			<div class="table-responsive">
				<table class="table table-striped m-b-none" data-ride="datatables">
					<thead>
						<tr>
							<th width="20%">ID</th>
							<th width="25%">Browser</th>
							<th width="25%">Platform(s)</th>
							<th width="15%">Engine version</th>
							<th width="15%">CSS grade</th>
						</tr>
					</thead>
					<tbody>
					</tbody>
				</table>
			</div>
		</section>
		<script src="<?php echo base_url(); ?>js/jquery.min.js"></script>
		<!-- Bootstrap -->
		<script src="<?php echo base_url(); ?>js/bootstrap.js"></script>
		<!-- datatables -->
		<script src="<?php echo base_url(); ?>js/datatables/jquery.dataTables.min.js"></script>
	</body>
</html>
<script language="javascript">
	$(document).ready(function(){
	// datatable
		$('[data-ride="datatables"]').each(function() {
			var oTable = $(this).dataTable( {
				"bProcessing": true,
				"sAjaxSource": "http://localhost/_other/todo_admin/js/data/jsonGrid.php",
				"sDom": "<'row'<'col-sm-6'l><'col-sm-6'f>r>t<'row'<'col-sm-6'i><'col-sm-6'p>>",
				"sPaginationType": "full_numbers",
				"aoColumns": [
					{ "mData": "engine" },
					{ "mData": "browser" },
					{ "mData": "platform" },
					{ "mData": "version" },
					{ "mData": "grade" }
				]
			} );
		});
	});	
</script>